<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="app">
        <counter></counter>
        <counter></counter>
        <counter></counter>
    </div>
    <script src="../node_modules/vue/dist/vue.js"></script>
    <script type="text/javascript" >
            //定义全局组件
            /*Vue.component('counter',{
                template:'<button @click="count++">点我试试,点了我{{count}}次</button>',
                data(){
                    return {
                        count:0
                    }
                }
            });*/
            //局部组件
                let counter={
                    template:`<button @click="count++">点我试试,点了我{{count}}次</button>`,
                    data(){
                        return {
                            count:0
                        }
                    }
                };
            let vm = new Vue({
                el:'#app',
                data:{

                },
                components:{
                    counter
                }
            });
    </script>
</body>
</html>